<template>
    <div id="app">
        <div class="tab-container"  >
            <!--TabCotainer-->
            <router-view class="tab-my" v-on:login="getWxCode"></router-view>
            <tab-container v-model="active" :swipeable="swipeable">
                <tab-container-item id="index" >
                    <router-view class="tab-index" name="index" v-on:login="getWxCode"></router-view>
                </tab-container-item>
                <tab-container-item id="mine">
                    <router-view class="tab-my" name="mine" v-on:login="getWxCode"></router-view>
                </tab-container-item>
            </tab-container>
        </div>
        <Tabbar @tabChange="setActiveTab" v-if="tabbarShow" v-bind:active="selected"></Tabbar>
    </div>
</template>

<script>
    import Tabbar from '@/components/Tabbar.vue'
    import { TabContainer, TabContainerItem } from 'mint-ui';
    export default {
        name: 'App',
        components: { Tabbar,TabContainer, TabContainerItem },
        data() {
            return {
                wxAuthScope: 'userinfo',
                redirectUrl: process.env.WX_REDIRECT_URL,
                wxAppId: process.env.WX_APPID,
                active: '',
                swipeable:true,
            }
        },
        watch: {

        },
        computed: {
            selected(){
                return this.active
            },
            tabbarShow() {
                return this.$store.getters.getTabbarShow
            }
        },
        created() {
            if( this.$route.name === 'Mine' )
                this.active='mine'
            else if( this.$route.name === 'Home' ) {
                this.active='index'
            }
        },
        mounted() {
            this.getWxCode()
            /*this.$store.commit( 'SET_TOKEN','ogX7Us4sAAlpQQ0jZ8OdU9ms3f_c' )
            this.$store.commit( 'SET_USER', {
                city: "",
                nickname: "测试",
                openid: "ogX7Us4sAAlpQQ0jZ8OdU9ms3f_c",
                province: "",
                sex: "",
                headimgurl: "http://thirdwx.qlogo.cn/mmopen/vi_32/Br2eWib8ysIdiaOegMH7tpyvpSeiaicicCDialF03YYMgu4yFtXzbLnibDibXcy2ta99BDxlIQAgrZdJNT4JibXhKZL5QdA/132",
                uid:6
            } )*/
        },
        methods:{
            setActiveTab(value){
                this.active=value
            },

            //获取微信code
            getWxCode() { // 非静默授权，第一次有弹框
                const code=this.pubFun.getUrlParam( 'code' ) // 截取路径中的code，如果没有就去微信授权，如果已经获取到了就直接传code给后台获取openId

                if( !code ) {
                    window.location.href='https://open.weixin.qq.com/connect/oauth2/authorize?appid=' + this.wxAppId + '&redirect_uri=' + encodeURIComponent( this.redirectUrl ) + '&response_type=code&scope=snsapi_' + this.wxAuthScope + '&state=1#wechat_redirect'
                } else {
                    this.getWxOpenId( code ) //把code传给后台获取用户信息
                }
            },
            //根据code获取
            getWxOpenId( code ) { // 通过code获取 openId等用户信息，/api/user/wechat/login 为后台接口
                this.$axios.get( 'Index/wxinfo?code=' + code, ).then( ( res ) => {
                    this.$store.commit( 'SET_USER', res.data)
                    this.$store.commit( 'SET_TOKEN', res.data.openid )
                } ).catch( ( error ) => {
                    if( error.status >= 40000 ) { //授权出错
                        window.location.href='https://open.weixin.qq.com/connect/oauth2/authorize?appid=' + this.wxAppId + '&redirect_uri=' + encodeURIComponent( this.redirectUrl ) + '&response_type=code&scope=snsapi_' + this.wxAuthScope + '&state=1#wechat_redirect'
                    }
                } )
            },
        }
    }
</script>

<style>
</style>
